<template>
  <div id="xiala" @click="fun" ref="xiala">
    <van-dropdown-menu title-class="menu" active-color="#429d7d">
      <van-dropdown-item title="区域">
        <Area></Area>
      </van-dropdown-item>
      <van-dropdown-item title="价格"> </van-dropdown-item>
      <van-dropdown-item title="户型"> </van-dropdown-item>
      <van-dropdown-item title="更多"> </van-dropdown-item>
      <van-dropdown-item title="排序"> </van-dropdown-item>
    </van-dropdown-menu>
  </div>
</template>

<script>
import Area from "@/components/New/New06/Area";
// import $ from "jquery";
export default {
  name: "New06",
  data() {
    return {
      msg: "Stix",
      scrol: "",
    };
  },
  components: {
    Area,
  },
  mounted() {
    this.$refs.xiala.addEventListener(
      "scroll",
      (e) => {
        console.log("滚动条到顶部的距离", e.target.offsetTop);
        console.log("相对距离", this.$refs.xiala.scrollTop);
        console.log("绝对距离", e.target.offsetTop + this.$refs.xiala.scrollTop);
      },
      false
    );
  },
  watch: {
    scrol: function () {
      console.log(this.scrol);
    },
  },
  methods: {
    fun() {
      document.documentElement.scrollTop = 576;
    },
  },
};
</script>

<style scoped>
#xiala /deep/ .van-dropdown-menu .van-dropdown-menu__bar {
  height: 0.36rem !important;
  font-size: 0.1rem !important;
  color: #000 !important;
  font-weight: 500 !important;
}
</style>
